import React, {Component} from 'react';
import {SearchBar} from "antd-mobile";
import {require} from "../../../../netWork";
import styles from './index.module.css'

const {value} = JSON.parse(localStorage.getItem('hkzf'));

class RentSearch extends Component {
    state = {
        value: null,
    };

    onChange = (val) => {
        console.log(val);
        if (!val) {
            this.setState({tipsList: []});
            return
        } else {
            clearTimeout(this.timeId);
            this.timeId = setTimeout(async () => {
                await this.getCommunityData(val)
            }, 500)
        }
    };
    //获取小区数据
    getCommunityData = (val) => {
        require({
            url: '/area/community',
            data: {name: val, id: value}
        }).then(res => {
            console.log(res);
            if (res.status === 200) {
                this.setState({tipsList: res.body})
            }
        })
    };
    //渲染列表
    renderList = () => {
        const {tipsList} = this.state;
        console.log(tipsList);
        if(tipsList){
            return tipsList.map(item => {
                return <div className={styles.root} onClick={() => this.getCommunity(item.communityName,item.community)}>
                    <li>{item.communityName}</li>
                </div>
            })
        }else return null

    };
    //确定小区
    getCommunity = (val,id) =>{
        localStorage.setItem('community_val',val);
        console.log(this.props);
        this.props.history.replace(`/rent/add/${id}`)
    };

    render() {
        return (
            <div>
                <SearchBar
                    placeholder="Search"
                    onSubmit={value => console.log(value, 'onSubmit')}
                    onChange={val => this.onChange(val)}
                />
                {this.renderList()}
            </div>
        );
    }
}

export default RentSearch;
